<template>
	<view :class="currentTheme">
		<a-nabbar name="新增收益"/>
		<view class="u-padding-32">
			<item-box paddinglr="40">
				<view class="u-padding-left-20 u-padding-right-20">
					<label-box label="剧本名" labelSize="32" labelWidth="130" paddingTb="16" >
						<u-input v-model="form.productName" :clearable="false" border :borderColor="currentThemeObj.inputBorderColor" placeholder="请输入剧本名" :placeholder-style="`color:${currentThemeObj.placeholderColor}`"/>
					</label-box>
					<label-box label="DM" labelSize="32" labelWidth="130" paddingTb="16" >
						<select-item v-model="form.dm" :list="personList" v-if="personList.length" @getIds="getIds"></select-item>
						<view class="u-font-30" style="line-height: 70rpx;" v-else>暂无DM列表</view>
					</label-box>
					<label-box label="抽成" labelSize="32" labelWidth="130" paddingTb="16" >
						<text class="u-font-30" style="line-height: 70rpx;">{{dmObj.proportion || 0}}%</text>
					</label-box>
					<label-box label="单价" labelSize="32" labelWidth="130" paddingTb="16" >
						<u-input v-model="form.price" type="digit" :clearable="false" border :borderColor="currentThemeObj.inputBorderColor" placeholder=" " :placeholder-style="`color:${currentThemeObj.placeholderColor}`"/>
					</label-box>
					<label-box label="人数" labelSize="32" labelWidth="130" paddingTb="16" >
						<u-input v-model="form.payNum" type="number" :clearable="false" border :borderColor="currentThemeObj.inputBorderColor" placeholder=" " :placeholder-style="`color:${currentThemeObj.placeholderColor}`"/>
					</label-box>
					<label-box label="开始时间" labelSize="32" labelWidth="130" paddingTb="16">
						<select-item  v-model="form.startTime" mode="time"  secondType="hm"></select-item>
					</label-box>
					<label-box label="完成时间" labelSize="32" labelWidth="130"   paddingTb="16">
						<select-item  v-model="form.finishTime" mode="time"  secondType="hm"></select-item>
					</label-box>
				</view>
			</item-box>
		</view>
		<fixed-team btnText="提交" @btnClick="save"></fixed-team>
	</view>
</template>

<script>
	import {getDetail,add} from '@/api/crud.js'
	import labelBox from '@/components/labelBox/labelBox.vue'
	export default {
		data(){
			return {
				apiType:'systemStoreUser',
				apiModule:'shopApi',
				personList:[],
				form:{
				  "dmUid": '',
				  "finishTime": "",
					startTime:"",
				  "payNum": '',
				  "price": '',
				  "productName": "",
				  "proportion": '',
				  "total": ''
				},
				dmObj:{},
				loading:false
			}
		},
		computed:{
			storeId(){
				return this.$store.getters.loginForm.storeId
			}
		},
		onLoad() {
			getDetail({storeId:this.storeId},this.apiType,this.apiModule,'allStoreUser').then(res=>{
				this.personList = res.map(val=>({value:val.uid,label:val.nickname,extra:{proportion:val.proportion,userType:val.userType}}));
			})
		},
		methods:{
			getIds(id){
				this.form.dmUid = id;
				const dmObj = this.personList.find(val=>val.value==id) || {};
				this.dmObj = {...dmObj,...dmObj.extra}
			},
			save(){
				const {dmUid,productName,price,payNum,finishTime,startTime} = this.form;
				if(!dmUid){
					this.$u.toast('请选择DM')
					return false;
				}
				if(!productName){
					this.$u.toast('请填写剧本名称')
					return false;
				}
				if(!price){
					this.$u.toast('请填写单价')
					return false;
				}
				if(!payNum){
					this.$u.toast('请填写人数')
					return false;
				}
				if(!finishTime){
					this.$u.toast('请选择完成时间')
					return false;
				}
				if(!startTime){
					this.$u.toast('请选择开始时间')
					return false;
				}
				const form = {...this.form}
				form.proportion = this.dmObj.proportion;
				form.userType = this.dmObj.userType;
				form.finishTime+=':00'
				form.startTime+=':00'
				form.storeId = this.storeId
				this.loading = true;
				add(form,'incomeStatistics',this.apiModule,'create').then(res=>{
					this.routeBack('操作成功');
					setTimeout(()=>{
						this.loading=false
					},1500)
				}).catch(()=>this.loading=false)
			}
		}
	}
</script>

<style scoped>
	.form-label{
		width: 180rpx;
		color: white;
		font-size: 32rpx;
	}
</style>
